<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org/">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>添加充电桩</title>
	<link rel="stylesheet" href="/admin/src/css/layui.css">
	<style>
		.mr10{
			display: inline-block;
		}
		.layui-form-label{
			min-width: 120px;
		}
		.layui-form-item .layui-input-inline{
			width:320px;
		}
	</style>
</head>

<body >
	<form class="layui-form " style="margin:20px auto;">
		<div class="layui-form-item">
			<label class="layui-form-label">充电桩名称</label>
			<div class="layui-input-inline">
				<input type="text" name="title" id="title" lay-verify="required" placeholder="请输入充电桩名称" autocomplete="off" class="layui-input">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">充电桩设备编号</label>
			<div class="layui-input-inline">
				<input type="text" name="device_sn" id="device_sn" lay-verify="required"  placeholder="请输入充电桩设备编号" autocomplete="off" class="layui-input">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">站点编号</label>
			<div class="layui-input-inline">
				<input type="text" name="number_sn" id="number_sn"  placeholder="请输入站点编号" autocomplete="off" class="layui-input">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">充电桩类型</label>
			<div class="layui-input-inline">
				<select name="device_type" id="device_type" lay-verify="required">
					<option value="" >选择充电桩类型</option>
					<option value=1 >直流</option>
					<option value=2 >交流</option>
				</select>
			</div>
		</div>
		<div class="layui-form-item">
		    <label class="layui-form-label">充电桩状态</label>
		    <div class="layui-input-block">
				<input type="radio" name="is_status" value="1" title="开启" checked>
				<input type="radio" name="is_status" value="0" title="关闭">
		    </div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">充电模式</label>
			<div class="layui-input-block">
				<input type="radio" name="charge_type" value="1" title="快充" checked>
				<input type="radio" name="charge_type" value="2" title="慢充">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">所属站点</label>
			<div class="layui-input-inline">
				<select name="station_id" id="station_id" lay-verify="required" lay-search="">
					<option value="" >选择站点</option>
					{volist name='getList' id='item'}
					<option value="{$item['id']}" >{$item['title']}</option>
					{/volist}
				</select>
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">计费模型</label>
			<div class="layui-input-inline">
				<select name="cost_id" id="cost_id" lay-verify="required" lay-search="">
					<option value="" >选择计费模型</option>
					{volist name='billingModelList' id='billItem'}
					<option value="{$billItem['id']}" >{$billItem['title']}</option>
					{/volist}
				</select>
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">尖费电费率</label>
			<div class="layui-input-inline">
				<input type="text" name="charge_cost" id="charge_cost" lay-verify="required"  placeholder="请输入尖费电费率" autocomplete="off" class="layui-input">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">尖电服务费费率</label>
			<div class="layui-input-inline">
				<input type="text" name="service_cost" id="service_cost" lay-verify="required"  placeholder="请输入尖电服务费费率" autocomplete="off" class="layui-input">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">峰电费费率</label>
			<div class="layui-input-inline">
				<input type="text" name="peak_electric_cost" id="peak_electric_cost" lay-verify="required" placeholder="请输入峰电费费率" autocomplete="off" class="layui-input">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">峰电服务费费率</label>
			<div class="layui-input-inline">
				<input type="text" name="peak_service_cost" id="peak_service_cost" lay-verify="required" placeholder="请输入峰电服务费费率" autocomplete="off" class="layui-input">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">平电费费率</label>
			<div class="layui-input-inline">
				<input type="text" name="flat_electric_cost" id="flat_electric_cost" lay-verify="required" placeholder="请输入平电费费率" autocomplete="off" class="layui-input">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">平电服务费费率</label>
			<div class="layui-input-inline">
				<input type="text" name="flat_service_cost" id="flat_service_cost" lay-verify="required" placeholder="请输入平电服务费费率" autocomplete="off" class="layui-input">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">谷电费费率</label>
			<div class="layui-input-inline">
				<input type="text" name="valley_electric_cost" id="valley_electric_cost" lay-verify="required" placeholder="请输入谷电费费率" autocomplete="off" class="layui-input">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">谷电服务费费率</label>
			<div class="layui-input-inline">
				<input type="text" name="valley_service_cost" id="valley_service_cost" lay-verify="required" placeholder="请输入谷电服务费费率" autocomplete="off" class="layui-input">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">充电桩功率</label>
			<div class="layui-input-inline">
				<input type="text" name="power_number" id="power_number"  placeholder="请输入充电桩功率" autocomplete="off" class="layui-input">
			</div>
		</div>
		<!--<div class="layui-form-item">-->
			<!--<label class="layui-form-label">充电桩电压</label>-->
			<!--<div class="layui-input-inline">-->
				<!--<input type="text" name="voltage" id="voltage"  placeholder="请输入充电桩电压" autocomplete="off" class="layui-input">-->
			<!--</div>-->
		<!--</div>-->
		<!--<div class="layui-form-item">-->
			<!--<label class="layui-form-label">充电桩电流</label>-->
			<!--<div class="layui-input-inline">-->
				<!--<input type="text" name="electric_current" id="electric_current"  placeholder="请输入充电桩电流" autocomplete="off" class="layui-input">-->
			<!--</div>-->
		<!--</div>-->
		<!--<div class="layui-form-item">-->
			<!--<label class="layui-form-label">充电桩重量</label>-->
			<!--<div class="layui-input-inline">-->
				<!--<input type="text" name="weight" id="weight"  placeholder="请输入充电桩重量" autocomplete="off" class="layui-input">-->
			<!--</div>-->
		<!--</div>-->
		<div class="layui-form-item">
			<label class="layui-form-label">充电桩尺寸</label>
			<div class="layui-input-inline">
				<input type="text" name="size" id="size"  placeholder="请输入充电桩尺寸" autocomplete="off" class="layui-input">
			</div>
		</div>


		<div class="layui-form-item">
			<label class="layui-form-label">备注</label>
			<div class="layui-input-inline">
				<input type="text" name="remark" id="remark"  placeholder="请输入备注" autocomplete="off" class="layui-input">
			</div>
		</div>
	  <div class="layui-form-item">
	    <div class="layui-input-block">
	      <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
	    </div>
	  </div>
	</form>
	<script src="/admin/src/layui.js" ></script>

<script>

    layui.use(['form','jquery','upload'], function(){
      var form = layui.form ,
		  layer = layui.layer,
          upload = layui.upload,
		  $= layui.jquery;


      //监听表单提交
      form.on('submit(formDemo)', function(data){
		var getData = data.field;
          if(!getData['title']){
              layer.msg('请设置充电桩名称');
              return false
          }
          if(!getData['device_sn']){
              layer.msg('请设置充电桩设备编号');
              return false
          }
          if(!getData['station_id']){
              layer.msg('请选择所属站点');
              return false
          }
		$.ajax({
			url: '/admin/pile/add/data',
			type: 'POST',
			data:getData,
			success : function (backData) {
				//添加成功
			  if(backData['status'] == 200){
				  layer.msg(backData.message,{time:1200},function(){
					  window.parent.frames.location.href="/admin/pile/index"
				  })
				  
			  }else{
				  layer.msg(backData.message);
			  }
			}
		})
        return false;
      });
    });




</script>
</body>
</html>
